<template>
  <div>
    <h3>Left组件</h3>
    <p v-abc v-hello="'orange'">{{ uname }}</p>
  </div>
</template>

<script>
export default {
  props: ['uname'],
  directives: {
    abc: {
      bind (el) {
        el.style.color = 'pink'
      },
      update (el) {
        console.log('update=', el.innerHTML)
      },
      componentUpdated (el) {
        console.log('componentUpdated=', el.innerHTML)
      }
    }
  }
}
</script>

<style scoped>
div {
  min-height: 200px;
  background-color: skyblue;
}
</style>
